<template>
	<div>
		<h1>{{ title }}</h1>
	</div>
</template>

<script>
import { watchEffect, watch } from 'vue'
export default {
	name:'propsForSetup',
	props: {
		title:String
	},
	setup(props) {
		// 不要解构props 否则会让props 中的值丢失响应式
		// props 是不可变的 在提供者去更改
		console.log(props);// Proxy {}

		watchEffect(() =>{
			console.log(props.title);
		})

		watch(()=> props.title,(newValue)=>{
			console.log(newValue);
		})
	}
};
</script>

<style></style>
